<template>
	<div class="components-container">
        <div class="header-form">
          <div class="layui-inline">
            <label class="layui-form-label">发布日期</label>
            <div class="layui-inline">
              <el-radio-group v-model="addDateValue" @change="getData">
                <el-radio-button :label="DateSelectMode.now" class="radio">当日</el-radio-button>
                <el-radio-button :label="DateSelectMode.all" class="radio">全部</el-radio-button>
              </el-radio-group>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">取灰日期</label>
            <div class="layui-inline">
              <el-radio-group v-model="takDateValue" @change="getData">
                <el-radio-button :label="DateSelectMode.now" class="radio">当日</el-radio-button>
                <el-radio-button :label="DateSelectMode.all" class="radio">全部</el-radio-button>
              </el-radio-group>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">业务编号</label>
            <div class="layui-inline">
              <el-input v-model="selectData.RegbussnumEquals" placeholder="请输入业务编号" @keydown.enter.native="btnSearch"></el-input>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label">逝者姓名</label>
            <div class="layui-inline">
              <el-input v-model="selectData.RegnameLike" placeholder="请输入逝者姓名" @keydown.enter.native="btnSearch"></el-input>
            </div>
          </div>
          <el-button type="primary" @click="btnSearch" :loading="this.$store.state.isloading">搜索</el-button>
          <el-button @click="btnRepeat">重置</el-button>
        </div>
        <div>
            <ul class="toolList">
                <li v-if="btnShow(item.BTNVALUE)" v-for="(item, index) in $store.state.btnListCommon" @click="operate(item.BTNVALUE)">
                    <el-button type="primary" :value="item.BTNSHOWNAME" v-text="item.BTNSHOWNAME"></el-button>
                </li>
                <li v-if="btnShow('叫号')" @click="operate('叫号')">
                    <el-button type="primary">叫号</el-button>
                </li>
            </ul>
        </div>
        <dataTable :headList="headList" :dataList="dataList" :pageOrder="pageOrder" @pageChange="pageChange" @selectRow="selectRow"></dataTable>

        <takeashManageMain ref="takeashManageMain" :orderType="order" @refreshData="getData"></takeashManageMain>
	</div>
</template>

<style  rel="stylesheet/scss" lang="scss" scoped>

</style>
<script>
import takeashManageMain from "./takeashManageMain";
import dataTable from "@/components/Table/DataTable";
import apiBase from "@/api/apiBase.js";
import { formatDate, timeStringToDate } from "@/utils/date.js";
import { manage } from "@/mixins/managePage.js";
import { DATESELECTMODE } from "@/const/const.js";
import { ORDER } from "@/const/orderConst.js";

const ADD = "登记";
const DELETE = "删除";
const RECEIVE = "领取";
const CALRECEIVE = "取消领取";
const INFO = "详情";

export default {
  name: "takeashManage",
  mixins: [manage],
  data() {
    return {
      DateSelectMode: DATESELECTMODE,
      addDateValue: null,
      takDateValue: null,
      selectData: {},
      ischangered: null,
      ischangnb: null,
    };
  },
  methods: {
    //获取表头
    getColumn() {
      let data = {};
      apiBase.DoService(
        data,
        apiBase.getApiAdress().Column.GetTakeashColumns,
        res => {
          this.headList = res.data.content;
        },
        res => {
          this.$message.error(res.data.msg);
        }
      );
    },
    //取灰查询
    getData() {
      let data = {
        PageIndex: this.pageOrder.currentPage,
        PageSize: this.pageOrder.pageSize,
        OrderBy: this.pageOrder.orderType,
        OrderByType: this.pageOrder.orderSort,
        Data: JSON.parse(JSON.stringify(this.selectData))
      };
      apiBase.DoService(
        data,
        apiBase.getApiAdress().Takeash.Query,
        res => {
          this.dataList = res.data.content.OutData;
          this.pageOrder.totalNum = res.data.content.RecordCount;
          this.$nextTick(function() {
            let rows = document.getElementsByClassName("el-table__row");
            if(this.ischangered){
              this.dataList.forEach((item,index) => {
                  rows[index].style.color = '#606266';
                  if(item.REGCRETYPE === 'A'){
                      rows[index].style.color = 'red';
                  }
              });
            }
            if(this.ischangnb){
              this.dataList.forEach((item,index) => {
                  rows[index].style.color = '#606266';
                  if(item.REGCRETYPE === 'A'||item.REGCRETYPE === 'C'){
                      rows[index].style.color = '#007eff';
                  }
                  if(item.REGCRETYPE === 'D'){
                      rows[index].style.color = 'red';
                  }
              });
            }
          });
        },
        res => {
          this.$message.error(res.data.msg);
        }
      );
    },
    //功能操作
    operate(order) {
      this.order = order;
      switch (this.order) {
        case ADD:
          this.$refs.takeashManageMain.open(this.order);
          break;
        case DELETE:
          this.$refs.takeashManageMain.open(this.order, this.currentRow.TSHID);
          break;
        case RECEIVE:
          this.$refs.takeashManageMain.open(this.order);
          break;
        case CALRECEIVE:
          this.$refs.takeashManageMain.open(this.order);
          break;
        case INFO:
          this.$refs.takeashManageMain.open(this.order, this.currentRow.TSHID);
          break;
        case '叫号':
          if(this.currentRow){
            this.sound(this.currentRow.TSHDESC);
          }else{
            // console.log('未选中数据');
          }
          
          break;
        default:
      }
    },
    sound(val){
      var num = val.indexOf(' ');
      var vals = val.slice(num);
      if(this.isIE()){
          this.zhText = encodeURI(encodeURI(vals));
          this.voicebbUrl = "http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=3&text="+this.zhText;
          this.$refs.voiceads.play();
      }else{
        var msg = new SpeechSynthesisUtterance(vals);
        msg.lang = 'utf-8';
        msg.volume = 1;//音量，0-1默认为1
        msg.rate = 1;//控制语速的
        msg.pitch = 1;//表示说话的音高，数值，范围从0（最小）到2（最大）。默认值为1。
        window.speechSynthesis.speak(msg);
      }
    
    },
    isIE() { //ie?
      if (!!window.ActiveXObject || "ActiveXObject" in window)
        return true;
        else
        return false;
      },
    //查询条件重置
    btnRepeat() {
      this.selectData = {};
      this.addDateValue = DATESELECTMODE.now;
      this.selectData.TshaddGreaterAndEquals = formatDate(
        new Date(),
        "yyyyMMdd"
      );
      this.takDateValue = DATESELECTMODE.all;
      this.getData();
    },
    btnShow(btn) {
      let status = "";
      if (this.currentRow) {
        status = this.currentRow.STASTATUS;
      }
      switch (btn) {
        case ADD:
        case RECEIVE:
        case CALRECEIVE:
          return true;
          break;
        case DELETE:
          return this.currentRow != null;
          break;
        case '叫号':
          return true;
          break;
        default:
      }
    }
  },
  watch: {
    addDateValue: function(val) {
      this.selectData.TshaddGreaterAndEquals = null;
      this.selectData.TshaddLessAndEquals = null;
      switch (val) {
        case DATESELECTMODE.now:
          this.selectData.TshaddGreaterAndEquals = formatDate(
            new Date(),
            "yyyyMMdd"
          );
          break;
        default:
          break;
      }
    },
    takDateValue: function(val) {
      this.selectData.TshtakGreaterAndEquals = null;
      this.selectData.TshtakLessAndEquals = null;
      switch (val) {
        case DATESELECTMODE.now:
          this.selectData.TshtakGreaterAndEquals = formatDate(
            new Date(),
            "yyyyMMdd"
          );
          break;
        default:
          break;
      }
    }
  },
  components: {
    takeashManageMain,
    dataTable
  },
  created() {
    let data = {};
    apiBase.DoService(
        data,
        apiBase.getApiAdress().Param.GetIsDataTableReddening,
        res => {
            this.ischangered = res.data.content; 
        }
    );
    apiBase.DoService(
        data,
        apiBase.getApiAdress().Param.GetIsCreChangeRed,
        res => {
            this.ischangnb = res.data.content; 
        }
    );
    this.getColumn();
    this.btnRepeat();
    // console.log("btn", this.$store.state.btnListCommon);
  }
};
</script>

